<div id="mainarea" nv-file-drop="" uploader="uploader" filters="queueLimit, customFilter"> 
  <!--loc-->
  <div class="loc"> 债权管理 &gt; 批量导入 </div>
  <!--loc end-->
  <div class="container">
    <div class="area_block">
      <div class="area_content area_table area_multiple">
        <h3>批量导入</h3>
        <!-- Example: nv-file-select="" uploader="{Object}" options="{Object}" filters="{String}" -->
        <p> 为保证正确性，请先<a id="download" href="/itcast_p2p_action/creditor/download" class="c_blue">下载模板</a>，录入后通过批量导入功能完成</p>
        <button class="button">选择文件</button>
        <div style="margin-top:-25px;filter:alpha(opacity:0);opacity:0">
          <input type="file"  nv-file-select="" uploader="uploader"/>
        </div>
      </div>
    </div>
    <div class="area_block" style="margin-bottom: 40px">
      <div class="area_content area_multiple">
        <h3>上传文件</h3>
        <p>文件数量: {{ uploader.queue.length }}</p>
        <table class="table">
          <thead>
            <tr>
              <th width="20%">文件名</th>
              <th ng-show="uploader.isHTML5" width="5%">大小</th>
              <th ng-show="uploader.isHTML5" width="5%" >进度</th>
              <th width="5%">状态</th>
              <th width="10%">操作</th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="item in uploader.queue">
              <td><strong>{{ item.file.name }}</strong></td>
              <td ng-show="uploader.isHTML5" nowrap>{{ item.file.size/1024/1024|number:2 }} MB</td>
              <td ng-show="uploader.isHTML5"><div class="progress" style="margin-bottom: 0;width:60%">
                  <div class="progress-bar" role="progressbar" ng-style="{ 'width': item.progress + '%' }"></div>
                </div></td>
              <td>
                <span ng-show="item.isSuccess"><i class="glyphicon glyphicon-ok"></i></span> 
                <span ng-show="item.isCancel"><i class="glyphicon glyphicon-ban-circle"></i></span> 
                <span ng-show="item.isError"><i class="glyphicon glyphicon-remove"></i></span></td>
              <td nowrap>
                <button type="button" class="btn btn-success btn-xs" ng-click="item.upload()" ng-disabled="item.isReady || item.isUploading || item.isSuccess"> 
                <span class="glyphicon glyphicon-upload"></span> 上传 </button>
                <button type="button" class="btn btn-warning btn-xs" ng-click="item.cancel()" ng-disabled="!item.isUploading"> 
                <span class="glyphicon glyphicon-ban-circle"></span> 取消 </button>
                <button type="button" class="btn btn-danger btn-xs" ng-click="item.remove()"> 
                <span class="glyphicon glyphicon-trash"></span> 移除 </button>
              </td>
            </tr>
          </tbody>
        </table>
        <div>
          <div> 上传总进度:
            <div class="progress" style="">
              <div class="progress-bar" role="progressbar" ng-style="{ 'width': uploader.progress + '%' }"></div>
            </div>
          </div>
          <button type="button" class="btn btn-success btn-s" ng-click="uploader.uploadAll()" ng-disabled="!uploader.getNotUploadedItems().length"> <span class="glyphicon glyphicon-upload"></span> 全部上传 </button>
          <button type="button" class="btn btn-warning btn-s" ng-click="uploader.cancelAll()" ng-disabled="!uploader.isUploading"> <span class="glyphicon glyphicon-ban-circle"></span> 全部取消 </button>
          <button type="button" class="btn btn-danger btn-s" ng-click="uploader.clearQueue()" ng-disabled="!uploader.queue.length"> <span class="glyphicon glyphicon-trash"></span> 全部移除 </button>
        </div>
      </div>
    </div>
    <!--全部有效交易 end--> 
  </div>
</div>
